<template>
    <theme-box title="标签添加">
        <form class="form-inline" @submit.prevent v-el:form>
            <div class="box-body">
                <form-input title="标签内容" :required="true" name="labelName"></form-input>
                <form-select title="标签类型" :required="true" name="labelType" :options="labelOptions"></form-select>
            </div>
            <!-- /.box-body -->
            <div class="box-footer">
                <v-button type="reset" @click="reset">重置</v-button>
                <v-button type="submit" theme="primary" class="pull-right">确认</v-button>
            </div>
            <!-- /.box-footer -->
        </form>
    </theme-box>
</template>

<script>
    import 'plugins/jquery-validation';

    var serialize = require('form-serialize');


    export default {
        data: () => ({
            labelOptions: [
                {key: "首页搜索", value: "0"}
            ],
        }),
        methods: {
            reset () {
                $("label.error").remove();
                this.$els.form.reset()
            }
        },
        ready () {
            var self = this;
            $(this.$els.form).validate({
                submitHandler: async function () {
                    var _data = serialize(this.currentForm, {
                        hash: true,
                        empty: true
                    });
                    var result = await self.$post({
                        url: "/api/v1" + projectName_Url + "/plat/label/add",
                        data: _data
                    })
                    let data = {
                        title: "操作成功",
                        content: "是否进入标签列表查看?"
                    }
                    Midway.confirm(data).then(function () {
                        self.$route.router.go('/label/list');
                    })
                    self.reset()
                },

                errorPlacement: function (error, element) {
                    if (element.attr("name") == "file") {
                        error.insertAfter(".file-item");
                    } else {
                        error.insertAfter(element)
                    }
                },
                rules: {
                    labelName: {
                        required: true,
                        maxlength: 5

                    },
                    labelType: {
                        required: true,
                        maxlength: 1

                    }

                },
            });
        }
    }
</script>
